<template>
	<view>
		<view class="myhome">
			<!-- 已登录 -->
			<block v-if="thisUser">
				<view class="wx-name">
					<view>
						<image :src="thisUser.avatarUrl"></image>
					</view>
					<view class="warp-text">
						<text>{{thisUser.nickName}}</text>
						<text>Support provided by Wenjunzi Electronics Co., Ltd</text>
					</view>
				</view>
			</block>
			<!-- 未登录 -->
			<view class="wx-button" v-else>
				<view class="wx-button-view">智投简历，速登拿Offer</view>
				<view>
					<button plain="true" @click="getUserInfo">去登录</button>
				</view>
			</view>
		</view>
		<view style="background-color: beige;height: 25upx;"></view>
		<view class="backpic">
			<image
				src="cloud://liuwenjun-1g6675p9d28d14a3.6c69-liuwenjun-1g6675p9d28d14a3-1305215936/list/千库网_草原上的花丛唯美小清新数字艺术_插画编号108009.png">
			</image>
		</view>
		<thisModal ref="loginModal" @loginSuccess="loadUser"></thisModal>
	</view>
</template>

<script>
	import thisModal from '../../element/modal'
	var db = wx.cloud.database()
	var users = db.collection('user')
	//引进公用登录JS
	import {
		login
	} from '../../common/list.js'
	export default {
		name: "my",
		components: {
			thisModal
		},
		data() {
			return {
				wxlofin: false,
				username: [],
				thisUser: '',
			}
		},

		//判断用户是否登录
		onShow() {
			//请求数据库，判断用户有没有登录
			//this.ifUser()
		},

		async onLoad() {
			await this.loadUser()
		},

		methods: {
			async loadUser() {
				let thisUserRes = await wx.cloud.callFunction({
					name: 'login'
				})
				if (thisUserRes.result.code) this.thisUser = thisUserRes.result.data
			},

			getUserInfo() {
				this.$refs.loginModal.init()
			},


			//请求数据库，判断用户有没有登录
			ifUser() {
				users.get()
					.then((res) => {
						console.log(res)
						if (res.data.length === 0) {
							//没有登陆过
							this.wxlofin = false
						} else {
							this.wxlofin = true
							this.username = res.data
						}
					})
					.catch((err) => {
						console.log(err)
					})
			}
		},


	}
</script>

<style scoped>
	.myhome {
		background: linear-gradient(to top, #00aaff 10%, #107cff 100%);
		height: 280upx;
		display: flex;
		align-items: center;
	}

	text {
		display: block;
		margin: 10upx 0;
		color: #FFFFFF;
	}

	.wx-name image {
		width: 120upx !important;
		height: 120upx !important;
		border-radius: 50%;
		margin-right: 20upx;
		border: 10rpx solid #999999;
	}

	.wx-name {
		display: flex;
		align-items: center;
		padding: 0 30upx;
		align-content: center;
		height: 200upx;
	}

	.wx-text text:nth-child(1) {
		font-size: 35upx;
	}

	.wx-text text:nth-child(2) {
		font-size: 20upx;
		border: 1px solid #FFFFFF;
		padding: 7upx;
		border-radius: 50upx;
		text-align: center;
	}

	/* 登录 */
	.wx-button button {
		border: none;
		font-size: 30upx;
		background: linear-gradient(to right, #28a6f1 10%, #0e8dd7 80%);
		border-radius: 50upx;
		color: #FFFFFF;
	}

	.wx-button-view {
		font-size: 35upx;
		color: #FFFFFF;
		margin-bottom: 25upx;
	}

	.wx-button {
		margin: 0 auto;
	}

	.backpic {}

	.backpic image {
		width: 100%;
		height: 1000upx;
	}
</style>